<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>WeakMap基本使用</title>
  <!-- 
  `WeakMap`  是 JavaScript ES6 中引入的一种数据结构，类似于  `Map` ，但具有一些独特的特性。
  一、WeakMap 的定义
  `WeakMap`  是一种键值对集合，其中的键是弱引用。这意味着，如果没有其他引用指向这些键（对象），它们会被垃圾回收机制自动回收。 `WeakMap`  只能使用对象作为键，值可以是任意类型。

  二、创建 WeakMap
  使用  `new WeakMap()`  创建一个新的  `WeakMap`  实例：
  const myWeakMap = new WeakMap();

  三、基本操作
   1. 添加元素
  使用  `set(key, value)`  方法向  `WeakMap`  中添加键值对。键必须是对象，值可以是任意类型。
  const obj1 = { name: '小明' };
  const obj2 = { age: 25 };

  myWeakMap.set(obj1, '学生');
  myWeakMap.set(obj2, '程序员');
   2. 获取元素
  使用  `get(key)`  方法获取  `WeakMap`  中指定键的值。如果该键不存在，则返回  `undefined` 。
  console.log(myWeakMap.get(obj1)); // 输出: 学生
  console.log(myWeakMap.get(obj2)); // 输出: 程序员
   3. 删除元素

  使用  `delete(key)`  方法删除  `WeakMap`  中的元素。如果删除成功，返回  `true` ；如果该键不存在，返回  `false` 。
  myWeakMap.delete(obj1);
  console.log(myWeakMap.has(obj1)); // 输出: false
   4. 检查键

  使用  `has(key)`  方法检查  `WeakMap`  中是否存在某个键。
  console.log(myWeakMap.has(obj2)); // 输出: true
  console.log(myWeakMap.has(obj1)); // 输出: false

  四、WeakMap 的特点
  1. 弱引用：
    -  `WeakMap`  中的键是弱引用，这意味着如果没有其他引用指向这些键（对象），它们会被垃圾回收机制自动回收。

  2. 只能存储对象：
    -  `WeakMap`  只能使用对象作为键，键不能以基本数据类型（如字符串、数字、布尔值等）。

  3. 不可迭代：
    -  `WeakMap`  不支持迭代，因此不能使用  `for...of`  循环或其他迭代方法。

  4. 没有  `size`  属性：
    -  `WeakMap`  没有  `size`  属性，无法直接获取集合中元素的数量。

  五、使用场景
  `WeakMap`  适合用于以下场景：
  - 缓存对象：当需要缓存一些对象，但不希望阻止这些对象被垃圾回收时，可以使用  `WeakMap` 。
  - 跟踪对象的状态：可以使用  `WeakMap`  来跟踪某些对象的状态，例如标记哪些对象已经被处理过。

  六、总结
  -  `WeakMap`  是一种只允许对象作为键的集合，具有弱引用特性。
  - 主要方法包括  `set()` 、 `get()` 、 `delete()`  和  `has()` ，但不支持迭代和  `size`  属性。
  - 适合用于需要自动垃圾回收的对象管理场景。
  -->
</head>

<body>

  <script>
    // 1. WeakMap 的基本使用
    // 创建一个 WeakMap 实例
    const myWeakMap = new WeakMap();

    // 创建两个对象作为键
    const obj1 = { name: '学生' };
    const obj2 = { name: '程序员' };
    const fn = () => { console.log('fn'); }
    const arr = [1, 2, 3];

    // 向 WeakMap 中添加元素
    myWeakMap.set(obj1, '学生'); // 键是 obj1，值是 '学生'
    myWeakMap.set(obj2, '程序员'); // 键是 obj2，值是 '程序员'
    myWeakMap.set(fn, '函数'); // 键是 fn，值是 '函数'
    myWeakMap.set(arr, '数组'); // 键是 arr，值是 '数组'

    // 获取 WeakMap 中的元素
    console.log(myWeakMap.get(obj1)); // 输出: '学生'
    console.log(myWeakMap.get(obj2)); // 输出: '程序员'
    console.log(myWeakMap.get(fn)); // 输出: '函数'
    console.log(myWeakMap.get(arr)); // 输出: '数组'
    // obj1 = null; // 解除对 obj1 的引用
    // obj2 = null; // 解除对 obj2 的引用

    // 删除 WeakMap 中的元素
    myWeakMap.delete(obj1);

    // 检查 WeakMap 中是否存在某个键
    console.log(myWeakMap.has(obj1)); // 输出: false
    console.log(myWeakMap.has(obj2)); // 输出: true

  </script>

</body>

</html>